<template>
    <div>
        <ShowList></ShowList>
    </div>


</template>

<script setup lang="ts">
import ShowList from "../../Components/ShowList/index.vue";


</script>

<style lang="less" scoped>

.container{
    flex-wrap: wrap;
    display:flex;
    flex:1;
    .wrapperBox{
        flex-direction:column;
        display: flex;
        margin:5px;
        height:260px;
        width:224px;
        background-color: aqua;
        border-radius: 5px;
        img{
            height: 125px;
            width:224px;
            border-radius:5px;
        }
        .title{
            padding: 10px;
        }
        .interact{
            padding-left:15px;
            border-bottom: 1px solid #fff;
            padding-bottom: 5px;
            .star{
                display: flex;
                justify-content: space-between;
                width:120px;

            }
        }
        .self{
            padding-top: 5px;
            display: flex;
            align-items: center;
            justify-content: space-around;
            .nick{
                display: flex;
                align-items: center;
                span{
                    margin-left: 5px;
                }
            }
        }
    }
}

</style>
